<script setup>import { reactive, ref } from "@vue/reactivity";
import { ElMessage } from "element-plus";
import { post } from "../../utils"


let data = reactive({
    dialogVisible: false,
    list: [],
    sysResIds: [],
    defaultProps: {
        children: 'children',
        label: 'name',
    },
    sysRoleId: 0,
})

let sys = import.meta.env.VITE_SYS_NAME;
function getMenu() {

    post("/api/admin/GetSysResForRole", { sys, sysRoleId: data.sysRoleId, resType: 1 }).then((res) => {
        data.list = res.result.list;
        data.sysResIds = res.result.sysResIds;
    });
}
let tree = ref(null);
function show(sysRoleId) {
    data.sysResIds.length = 0;
    data.sysRoleId = sysRoleId;
    getMenu();
    data.dialogVisible = true;
}
function saveRoleRes() {
    var keys = []
        .concat(tree.value.getCheckedKeys())
        .concat(tree.value.getHalfCheckedKeys())

    post('/api/admin/SaveSysRoleRes', { sysRoleId: data.sysRoleId, sysResIds: keys }).then((res) => {
        ElMessage.success(res.msg);
        if (res.success) {
            data.dialogVisible = false
        }
    })
}
defineExpose({
    show
});
</script>

<template>
    <el-dialog title="设置权限" v-model="data.dialogVisible" width="550px">
        <el-scrollbar max-height="400px">
            <el-tree
                ref="tree"
                :data="data.list"
                show-checkbox
                default-expand-all
                :expand-on-click-node='false'
                check-on-click-node
                check-strictly
                node-key="id"
                :props="data.defaultProps"
                :default-checked-keys="data.sysResIds"
            />
        </el-scrollbar>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="data.dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="saveRoleRes">保 存</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<style lang="scss" scoped>
</style>